
import { Component } from 'react';

import { Avatar, List, Button } from 'antd';

import ds from '@/datasource.js';

class CommentList extends Component {
    constructor(props) {
      super(props);
      this.state = {
        list: props.data 
      }
    }
    render(){
        return (
            <div className="comment-list">
                <List itemLayout="horizontal" dataSource={ this.state.list } renderItem={ this.process } />
                <Button type="primary" onClick={ () => ds.addComment() }>新增</Button>
            </div>
        )
    }
    process( comment ){
        return (
            <List.Item>
                <List.Item.Meta
                    avatar={<Avatar src="https://joeschmoe.io/api/v1/random" />}
                    title={ comment.title }
                    description={ comment.desc }/>
            </List.Item>
        )
    }
}

export default CommentList ;